<template>
    <div class="common">
        <innerCommon 
            :location="location"
        >
            <template slot="left">
                <span>审核列表</span>
                <a-input-search class="inputStyle" placeholder="搜索用户名" enter-button @search="onSearch" v-model="searchValue" style="margin-left:10px" />
            </template>
            <div slot="right">
                <a-button type="primary" style="margin-right:10px;">导出</a-button>
                <a-button type="primary" @click="returnBack()">返回</a-button>
            </div>
            <div slot="table">
                <topList
                    :topList="topList"
                    :currentItem="currentItem"
                    @changeTop="changeTop"
                ></topList>
                <a-table 
                    size="middle"
                    :columns="columns" 
                    :data-source="list" 
                    :pagination="pagination"
                    :rowKey="record=>record.id"
                    @change="changePage"
                    :locale="{'emptyText': '暂无数据'}"
                    bordered>
                    <div slot="status" slot-scope="index,record">
                        <span v-if="record.status==0" style="color:orange">未审核</span>
                        <span v-else-if="record.status==1" style="color:green">已通过</span>
                        <span v-else style="color:red">已拒绝</span>
                    </div>
                    <div slot="action" slot-scope="index,record" class="tableAction">
                        <span v-if="record.status!=1" @click="updateStatus(1,record.id)">通过</span>
                        <span v-if="record.status!=2" @click="updateStatus(2,record.id)">不通过</span>
                        <confirmBox
                            v-if="record.status==2"
                            @handleOk="deleteTraining(record.id)"
                            :typeName="'删除'"
                            :noticeInfo="record.name"
                            :noticeType="'申请'"
                        ></confirmBox>
                    </div>
                </a-table>
            </div>
        </innerCommon>
    </div>
</template>
<script>
const columns=[
    {
        title: '序号',
        dataIndex: 'index',
        width:70
    },{
        title: '用户名',
        dataIndex: 'name',
    },{
        title: '账号',
        dataIndex: 'account',
    },{
        title: '真实姓名',
        dataIndex: 'realname',
    },{
        title: '所在单位',
        dataIndex: 'instituteName',
    },{
        title: '身份证号码',
        dataIndex: 'idCardNum',
    },{
        title: '联系方式',
        dataIndex: 'telephone',
    },{
        title: '审核时间',
        dataIndex: 'pubTime',
    },{
        title: '审核人',
        dataIndex: 'publisher',
    },{
        title: '状态',
        scopedSlots: { customRender: 'status' },
    },{
        title: '操作',
        scopedSlots: { customRender: 'action' },
    }
]
import {getTrainingApplyListApi,updateTrainingStatusApi,deleteTrainingApplyApi} from "@/request/api"
import innerCommon from "@/components/common/innerCommon"
import confirmBox from "@/components/common/confirmBox"
import topList from "@/components/common/topList"
export default {
    name:"trainingManagerAdd",
    components:{innerCommon,confirmBox,topList},
    created(){
        this.classId=this.$route.query.id
        this.activeName=this.$route.query.title
        this.init()
        this.location=[{
            name:"教学课堂管理",
            path:''
        },{
            name:"培训管理",
            path:'/trainingManager'
        },{
            name:"审核报名（"+this.activeName+"）",
            path:'/trainingApply'
        }]
    },
    watch:{
        searchValue:function(val){
            this.searchValue=val.trim()
        }
    },
    data(){
        return{
            columns,
            location:[],
            list:[],
            searchInfo:{
                page:1,
                pageSize:10,
                keyword:'',
                type:'1'
            },
            pagination:{total:0,page:1},
            searchValue:'',
            topList:[
                {
                    name:"已审核人员信息",
                    id:'1'
                },{
                    name:'待审核人员信息',
                    id:'0'
                }
            ],
            currentItem:'1',
            classId:null,
            activeName:""
        }
    },
    methods:{
        init(){
            this.getToken(getTrainingApplyListApi,{...this.searchInfo,'classId':this.classId},res=>{
                this.list=res.data.rows.map((item,index)=>({
                    ...item,
                    'index':(this.searchInfo.page-1)*10+index+1,
                    ...item.creator,
                    'id':item.id,
                    'publisher':item.publisher&&item.publisher.name
                }))
                this.pagination.total=res.data.count
            })
        },
        changTime(start,end){
            this.searchInfo.startTime=start
            this.searchInfo.endTime=end
            this.init()
        },
        updateStatus(status,id){
            this.getToken(updateTrainingStatusApi,{'applyId':id,status},res=>{
                this.$message.success(res.message)
                this.init()
            })
        },
        deleteTraining(id){
            this.getToken(deleteTrainingApplyApi,{'applyId':id},res=>{
                this.$message.success(res.message)
                this.init()
            })
        },
        changePage(data){
            this.searchInfo.page=data.current
            this.init()
        },
        onSearch(data){
            this.searchInfo.keyword=data
            this.init()
        },
        changeTop(id){
            this.currentItem=id
            this.searchInfo.type=id
            this.init()
        },
        returnBack(){
            this.$router.go(-1)
        }
    }
}
</script>
<style lang="stylus" scoped>

</style>